{extend name="extend:iframe" /}

{block name="css"}
<link rel="stylesheet" type="text/css" href="/public/admin/css/layout.global.css" />
<link rel="stylesheet" type="text/css" href="/public/plug/FormCombox/FormCombox.css" />
<link rel="stylesheet" type="text/css" href="/public/plug/editormd/css/editormd.css" />
<style type="text/css">
.layout-form {
    padding-left: 0;
    padding-right: 16px;
}
.layout-form * {
    font-size: 14px;
}
.editormd-dialog-header {
	line-height: normal!important;
}
.nav-tab-item {
	display: none;
}
</style>
{/block}


{block name="body"}
<div class="_title">
    <div class="_main">系统设置</div>
    <div class="_sub clearfix">
        <div class="_btns">
            <ul class="clearfix">
                <li class="active" layout-mark="nav-tab" data-main="baseinfo">基本信息</li>
                <li layout-mark="nav-tab" data-main="kfinfo">客服信息</li>
                <!-- <li>轮播</li> -->
                <li layout-mark="nav-tab" data-main="aboutjzl">关于价值链</li>
            </ul>
        </div>
    </div>
</div>
<div class="_content">
	<div class="nav-tab-item" id="baseinfo-view">
		<div class="layout-form p-t-6x">
			<div class="layout-combox "><label class="layout-form-label">邮箱</label>
				<div class="layout-form-ipt"><input type="text" name="email"></div>
			</div>
			<div class="layout-combox "><label class="layout-form-label">电话1</label>
				<div class="layout-form-ipt"><input type="text" name="phone1"></div>
			</div>
			<div class="layout-combox "><label class="layout-form-label">电话2</label>
				<div class="layout-form-ipt"><input type="text" name="phone2"></div>
			</div>
			<div class="layout-combox "><label class="layout-form-label">地址</label>
				<div class="layout-form-ipt"><input type="text" name="address"></div>
			</div>
			<div class="layout-combox "><label class="layout-form-label">网址</label>
				<div class="layout-form-ipt"><input type="text" name="url"></div>
			</div>
			<div class="layout-combox "><label class="layout-form-label">备案号</label>
				<div class="layout-form-ipt"><input type="text" name="record"></div>
			</div>
		</div>
		<div class="box-buttom clearfix p-b-4x" style="width: 240px; padding-left: 100px;">
			<a href="javascript:;" class="submit-buttom float-left" id="btn-baseinfo-submit">确定</a>
		</div>
	</div>
	<div class="nav-tab-item" id="kfinfo-view">
		<div class="layout-form p-t-6x">
			<div class="layout-combox "><label class="layout-form-label">客服QQ1</label>
				<div class="layout-form-ipt"><input type="text" name="qq1"></div>
			</div>
			<div class="layout-combox "><label class="layout-form-label">客服QQ2</label>
				<div class="layout-form-ipt"><input type="text" name="qq2"></div>
			</div>
			<div class="layout-combox "><label class="layout-form-label">客服QQ3</label>
				<div class="layout-form-ipt"><input type="text" name="qq3"></div>
			</div>
		</div>
		<div class="box-buttom clearfix p-b-4x" style="width: 240px; padding-left: 100px;">
			<a href="javascript:;" class="submit-buttom float-left" id="btn-kfinfo-submit">确定</a>
		</div>
	</div>
	<div class="nav-tab-item" id="aboutjzl-view">
		<div class="layout-form p-t-6x">
			<div class="layout-combox "><label class="layout-form-label">内容</label>
				<div class="layout-form-ipt">
					<div class="" id="content-editormd">
						<textarea id="content" name="content" style="height: 320px"></textarea>
					</div>
				</div>
			</div>
		</div>
		<div class="box-buttom clearfix p-b-4x" style="width: 240px; padding-left: 100px;">
			<a href="javascript:;" class="submit-buttom float-left" id="btn-aboutjzl-submit">确定</a>
		</div>
	</div>
</div>
{/block}


{block name="js"}
<script type="text/javascript" src="/public/plug/editormd/src/editormd.js"></script>
<script type="text/javascript" src="/public/plug/layer/layer.min.js"></script>
<script type="text/javascript" src="/public/modules/tool.js"></script>
<script type="text/javascript" src="/public/modules/interactive.js"></script>
<script type="text/javascript">
	$(function() {
		$('li[layout-mark=nav-tab]').on('click', function() {
			var name = $(this).attr('data-main');
			if (!opt_jude[name]) {
				get_info[name](name);
				opt_jude[name] = true;
			} else {
				$('#' + name + '-view').show().siblings('.nav-tab-item').hide();
				// 重置页面高度
				resetIframeHeight();
			}
		});
		
		// 主动触发
		$('li[data-main=baseinfo]').trigger('click');
		
		// 绑定提交按钮
		$('#btn-baseinfo-submit').on('click', submitBaseinfo);
		$('#btn-kfinfo-submit').on('click', submitKfinfo);
		$('#btn-aboutjzl-submit').on('click', submitAboutjzl);
	});
	
	var opt_jude = {
			baseinfo: false,
			kfinfo: false,
			aboutjzl: false
		},
		get_info = {
			baseinfo: function(name) {
				// 获取基本信息
				layer.load(0, {
					shade: [0.08, '#000']
				});
				ajax().get('/api?base.get', function(res) {
					layer.closeAll('loading');
					if (res.status >= 200 && res.status < 300) {
						var list = res.data;
						$('input[name=email]').val(list.email);
						$('input[name=phone1]').val(list.phone1);
						$('input[name=phone2]').val(list.phone2);
						$('input[name=address]').val(list.address);
						$('input[name=url]').val(list.url);
						$('input[name=record]').val(list.record);
					} else {
						window.parent.system.error(res.error);
					}
					$('#' + name + '-view').show().siblings('.nav-tab-item').hide();
					// 重置页面高度
					resetIframeHeight();
				});
			},
			kfinfo: function(name) {
				// 获取客服信息
				layer.load(0, {
					shade: [0.08, '#000']
				});
				ajax().get('/api?kf.get', function(res) {
					layer.closeAll('loading');
					if (res.status >= 200 && res.status < 300) {
						var list = res.data;
						$('input[name=qq1]').val(list.qq1);
						$('input[name=qq2]').val(list.qq2);
						$('input[name=qq3]').val(list.qq3);
					} else {
						window.parent.system.error(res.error);
					}
					$('#' + name + '-view').show().siblings('.nav-tab-item').hide();
					// 重置页面高度
					resetIframeHeight();
				});
			},
			aboutjzl: function(name) {
				// 获取关于价值链
				layer.load(0, {
					shade: [0.08, '#000']
				});
				ajax().get('/api?about.get', function(res) {
					layer.closeAll('loading');
					if (res.status >= 200 && res.status < 300) {
						var list = res.data;
						var cont = list.content;
						cont = cont.replace(/&lt;/gi, '<');
						$('textarea[name=content]').val(cont);
					} else {
						window.parent.system.error(res.error);
					}
					$('#' + name + '-view').show().siblings('.nav-tab-item').hide();
					// 初始化编辑器
					initEditor();
					// 重置页面高度
					resetIframeHeight();
				});
			}
		};
	
	// 初始化编辑器
	function initEditor() {
		var editor = editormd("content-editormd", {
			width: '100%',
			height: 540,
			path: '/public/plug/editormd/lib/',
			codeFold: true,
			saveHTMLToTextarea: true,
			searchReplace: true,
			htmlDecode: "style,script,iframe|on*",
			emoji: true,
			taskList: true,
			toolbarIcons: ["undo", "redo", "image", "code", "preformatted-text", "code-block", "table", "|", "watch", "preview", "fullscreen"],
			tocm: true, // Using [TOCM]
			tex: true, // 开启科学公式TeX语言支持，默认关闭
			flowChart: true, // 开启流程图支持，默认关闭
			sequenceDiagram: true, // 开启时序/序列图支持，默认关闭,
			imageUpload: true,
			imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
			imageUploadURL: "/api?common.editUpload",
			onload: function() {
				//console.log('onload', this);
			}
		});
	}
	
	// 修改个人信息
	function submitBaseinfo() {
		var data_opt = {};
		$('#baseinfo-view').find('input').each(function() {
			var name = this.name;
			data_opt[name] = this.value;
		});
		layer.load(0, {
			shade: [0.08, '#000']
		});
		ajax().put('/api?base.complete', data_opt, function(res) {
			layer.closeAll('loading');
			if(res.status == 201) {
				window.parent.system.success('修改成功');
			} else {
				window.parent.system.error(res.error);
			}
		});
	}
	
	// 修改客服信息
	function submitKfinfo() {
		var data_opt = {};
		$('#kfinfo-view').find('input').each(function() {
			var name = this.name;
			data_opt[name] = this.value;
		});
		layer.load(0, {
			shade: [0.08, '#000']
		});
		ajax().put('/api?kf.complete', data_opt, function(res) {
			layer.closeAll('loading');
			if(res.status == 201) {
				window.parent.system.success('修改成功');
			} else {
				window.parent.system.error(res.error);
			}
		});
	}
	
	// 修改关于价值链
	function submitAboutjzl() {
		var data_opt = {};
		// 转码
		var str = $('#content').val();
		str = str.replace(/</gi, "&lt;");
		data_opt['content'] = str;
		layer.load(0, {
			shade: [0.08, '#000']
		});
		ajax().put('/api?about.complete', data_opt, function(res) {
			layer.closeAll('loading');
			if(res.status == 201) {
				window.parent.system.success('修改成功');
			} else {
				window.parent.system.error(res.error);
			}
		});
	}
</script>


{/block}